<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">

<head>
    <title>订单详情</title>
    <div data-th-replace="layout/user/user-center-head"></div>
</head>
<body>
    <div data-th-replace="layout/user/user-head"></div>
    <div class="u-bg">
        <div class="container pr u-container" id="uCenterMain">
            <section class="uCenter-box pa" id="uCenter-box">
                <div class="row uH">
                    <div class="col-sm-12 uH">
                        <div class="u-i-left__wrap u-i-left_box uH">
                            <!--左侧公共菜单 开始-->
                            <div data-th-replace="layout/user/user-left-menu"></div>
                            <!--左侧公共菜单 结束-->
                            <!--内容开始-->
                            <article class="u-c-c-cont__wrap u-c-c-main uH">
                                <div class="u-c-box uH" style="min-height: 100%;">
                                    <div class="mr20 pr10 pt10 uH">
                                        <section class="c-head-title clearfix">
                                            <aside class="pull-right mt10">
                                                <a href="javascript:void(0);" id="calendarBtn1" class="c-fff fs14 pr" title="去签到">
                                                    <i class="fa fa-calendar-check-o mr5"></i>签到
                                                </a>
                                            </aside>
                                            <h6>
                                                <a th:href="@{/web/uc/order/list}" class="fs14 c-333 vam hLh30">我的订单</a>
                                                <i class="fa fa-angle-right fs14 c-333 ml5 mr5 vam"></i>
                                                <span class="vam fs14" th:text="${order['orderNo']}"></span>
                                            </h6>
                                        </section>
                                        <!--startprint-->
                                        <section class="u-head-title">
                                            <aside>
                                                <span class="fs18">订单的详细信息如下</span>
                                            </aside>
                                        </section>
                                        <div class="mt20 mb20 pb10 right-box" id="sinopec_add_form">
                                            <div class="right-s-box u-my-course_box">
                                                <section class="orderInfor">
                                                    <div class="orderTitle hLh30">
                                                        <i class="fa fa-circle-o"></i>
                                                        <span class="fs16 c-333 ml5">订单信息</span>
                                                    </div>
                                                    <div class="row mt20 pt10">
                                                        <section class="col-sm-4">
                                                            <div class="media ml20">
                                                                <aside class="media-left vam">
                                                                    <em class="u-i-baseTj-ico u-i-s-ico u-i-baseTj-ico-5 mr20">&nbsp;</em>
                                                                </aside>
                                                                <section class="media-body">
                                                                    <div class="hLh30 txtOf"><span class="fs16" th:text="${order['orderNo']}"></span></div>
                                                                    <span class="fs12">订单编号</span>
                                                                </section>
                                                            </div>
                                                        </section>
                                                        <section class="col-sm-3">
                                                            <div class="media">
                                                                <aside class="media-left vam">
                                                                    <em class="u-i-baseTj-ico u-i-s-ico u-i-baseTj-ico-6">&nbsp;</em>
                                                                </aside>
                                                                <section class="media-body">
                                                                    <div class="hLh30 txtOf">
                                                                        <span class="fs16" th:text="${order['user']['nickname']}"></span>
                                                                    </div>
                                                                    <span class="fs12">下单用户</span>
                                                                </section>
                                                            </div>
                                                        </section>
                                                        <section class="col-sm-2">
                                                            <div class="media">
                                                                <aside class="media-left vam">
                                                                    <em class="u-i-baseTj-ico u-i-s-ico u-i-baseTj-ico-7">&nbsp;</em>
                                                                </aside>
                                                                <section class="media-body">
                                                                    <div class="hLh30 txtOf">
                                                                        <span th:if="${order['orderStatus']}=='SUCCESS'" class="fs16 c-success">已支付</span>
                                                                        <span th:if="${order['orderStatus']}=='INIT'" class="fs16 c-danger">未支付</span>
                                                                        <span th:if="${order['orderStatus']}=='REFUND'" class="fs16 c-danger">已退费</span>
                                                                        <span th:if="${order['orderStatus']}=='CANCEL'" class="fs16 c-danger">已取消</span>
                                                                    </div>
                                                                    <span class="fs12">支付状态</span>
                                                                </section>
                                                            </div>
                                                        </section>
                                                        <section class="col-sm-3">
                                                            <div class="media">
                                                                <aside class="media-left vam">
                                                                    <em class="u-i-baseTj-ico u-i-s-ico u-i-baseTj-ico-8">&nbsp;</em>
                                                                </aside>
                                                                <section class="media-body">
                                                                    <div class="hLh30 txtOf">
                                                                        <span class="fs16" th:text="${#strings.substring(order['createTime'],0,16)}"></span>
                                                                    </div>
                                                                    <span class="fs12">下单时间</span>
                                                                </section>
                                                            </div>
                                                        </section>
                                                    </div>
                                                </section>
                                                <section class="shopInfor mt20 pt10">
                                                    <div class="orderTitle hLh30">
                                                        <i class="fa fa-circle-o fa_shop"></i>
                                                        <span class="fs16 c-333 ml5">商品信息</span>
                                                    </div>
                                                    <div class=" mt20">
                                                        <table class="table uTable u-sTable">
                                                            <thead>
                                                                <tr>
                                                                    <th width="40%"><span class="c-333 fs12">清单</span></th>
                                                                    <th width="10%" class="text-center"><span class="c-333 fs12">数量</span></th>
                                                                    <th width="10%" class="text-center"><span class="c-333 fs12">原价</span></th>
                                                                    <th width="11%" class="text-center"><span class="c-333 fs12">优惠</span></th>
                                                                    <th width="10%" class="text-center"><span class="c-333 fs12">活动</span></th>
                                                                    <th width="17%" class="text-center"><span class="c-333 fs12">金额</span></th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                <tr th:each="details,index : ${order['orderDetailsList']}">
                                                                    <td>
                                                                        <div class="media">
                                                                            <div class="media-body">
                                                                                <section class="cm-desc-txt__twoLine">
                                                                                    <a th:if="${details['shopType']}=='COURSE'" th:href="@{/web/course/courseInfo?courseId={courseId}(courseId=${details['shopId']})}" target="_blank" class="c-999" th:text="${details['shop']['course']['courseName']}"></a>
                                                                                    <a th:if="${details['shopType']}=='BOOK'" th:href="@{/web/book/info?bookId={bookId}(bookId=${details['shopId']})}" target="_blank" class="c-999" th:text="${details['shop']['book']['bookName']}"></a>
                                                                                    <a th:if="${details['shopType']}=='MEMBER'" href="javascript:void(0);" class="c-999" th:text="${details['shop']['member']['memberName']}"></a>
                                                                                    <a th:if="${details['shopType']}=='ACCOUNT'" href="javascript:void(0);" class="c-999">账户充值</a>
                                                                                    <a th:if="${details['shopType']}=='EXAM'" href="javascript:void(0);" class="c-999" th:text="${details['shop']['exam']['name']}"></a>
                                                                                    <a th:if="${details['shopType']}=='QA'" href="javascript:void(0);" class="c-999" th:text="${details['shop']['qa']['context']}"></a>
                                                                                    <a th:if="${details['shopType']}=='ATTEND'" href="javascript:void(0);" class="c-999" th:text="${details['shop']['qa']['context']}"></a>
                                                                                </section>
                                                                            </div>
                                                                        </div>
                                                                    </td>
                                                                    <td class="text-center" style="vertical-align: middle;" valign="middle">
                                                                        <span class="c-666" th:text="${details['buyNum']}"></span>
                                                                    </td>
                                                                    <td class="text-center" style="vertical-align: middle;" valign="middle">
                                                                        <span class="c-666">
                                                                            <small class="fs12">
                                                                                <i class="fa fa-yen"></i>
                                                                            </small>
                                                                            <samp th:text="${details['price']}"></samp>
                                                                        </span>
                                                                    </td>
                                                                    <td class="text-center" style="vertical-align: middle;" valign="middle">
                                                                        <span class="c-666">
                                                                            <small class="fs12">- <i class="fa fa-yen"></i></small>
                                                                            <samp th:text="${details['yhPrice']}"></samp>
                                                                        </span>
                                                                    </td>
                                                                    <td class="text-center" style="vertical-align: middle;" valign="middle">
                                                                        <span class="c-666">
                                                                            <small class="fs12">- <i class="fa fa-yen"></i></small>
                                                                            <samp th:text="${details['activityPrice']}"></samp>
                                                                        </span>
                                                                    </td>
                                                                    <td class="text-center" style="vertical-align: middle;" valign="middle">
                                                                        <span class="c-danger">
                                                                            <small class="fs12">
                                                                                <i class="fa fa-yen"></i>
                                                                            </small>
                                                                            <samp th:text="${details['realPrice']}"></samp>
                                                                        </span>
                                                                    </td>
                                                                </tr>
                                                            </tbody>
                                                        </table>
                                                        <div class="row mt20 aTotal-box">
                                                            <section class="col-sm-6">
                                                                <span class="ml20 pt10 fs12 show uPrompt">信息：打印订单只是需要自己的单据，不提供法理依据。</span>
                                                            </section>
                                                            <section class="col-sm-6 aTotal">
                                                                <p class="text-right">
                                                                    <span class="a-t-describe">实付金额：</span>
                                                                    <span class="c-666 fs18">
                                                                        <small class="">
                                                                            <i class="fa fa-yen"></i>
                                                                        </small>
                                                                        <samp th:text="${#numbers.formatDecimal(order['sumPrice'],1,2)}"></samp>
                                                                    </span>
                                                                </p>
                                                                <p class="text-right">
                                                                    <span class="a-t-describe">总优惠：</span>
                                                                    <span class="c-666 fs18"><small class="">- <i class="fa fa-yen"></i></small>
                                                                        <samp th:text="${#numbers.formatDecimal(order['activityPrice']+order['yhPrice']+order['memberSubPrice'],1,2)}"></samp>
                                                                    </span>
                                                                </p>
                                                                <p class="text-right">
                                                                    <span class="a-t-describe">总计：</span>
                                                                    <span class="c-danger fs18">
                                                                        <small class=""><i class="fa fa-yen"></i></small>
                                                                        <samp th:text="${#numbers.formatDecimal(order['realPrice'],1,2)}"></samp>
                                                                    </span>
                                                                </p>
                                                                <p class="text-right mt20">
                                                                    <a href="javascript:void(0);" class="btn btn-info btn-outline startLearning btn-rounded" id="printPageBtn">
                                                                        <i class="fa fa-print mr10">打印单据</i>
                                                                    </a>
                                                                    <a href="" th:if="${order['orderStatus']}=='INIT'" th:href="@{/web/uc/order/newlyOrder?orderId={id}(id=${order['id']})}" class="btn btn-danger btn-rounded ml20">完成付款</a>
                                                                    <a href="javascript:void(0);" th:if="${order['orderStatus']}=='SUCCESS' and !${#maps.isEmpty(order['orderBook'])} and ${order['orderBook']['mailStatus']}==2 and ${order['orderBook']['signStatus']}==1" th:attrappend="data-id=${order['id']}" class="btn btn-danger btn-rounded ml20 sign-book">图书签收</a>
                                                                </p>
                                                            </section>
                                                        </div>
                                                    </div>
                                                </section>
                                            </div>
                                        </div>
                                        <!--endprint-->
                                    </div>
                                </div>
                            </article>
                            <!--内容结束-->
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>
    <div data-th-replace="layout/user/user-common"></div>
    <!--公共引入签到js-->
    <script th:src="@{{path}/front/web/business/common/processing-check-in.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script th:src="@{{path}/front/web/business/order/uc/user-order-info.js?v={v}(path=${staticPath},v=${v})}"></script>
</body>
</html>
